<template>
  <div class="data-container">
      <analysis-home :active="4"></analysis-home>
      <div class="analysis4-main-content">
        <el-row>
          <el-col :span="6">
            <div class=" item h-1-2">
              <box-card-multi-analysis-4-menzhenshouru title="门急诊收入排行" :items="items1"></box-card-multi-analysis-4-menzhenshouru>
            </div>
            <div class=" item h-1-2">
              <box-card-multi-analysis-4-zhuyuanshouru title="住院收入排行" :items="items5"></box-card-multi-analysis-4-zhuyuanshouru>
            </div>
          </el-col>
          <el-col :span="18">
            <div class="h-345-947">
              <el-col :span="8" class="h-345-947">
                <box-card-multi-analysis-4-yijiyewuliang title="医技业务量统计" :items="items2"></box-card-multi-analysis-4-yijiyewuliang>
              </el-col>
              <el-col :span="8" class="h-345-947">
                <box-card-multi-analysis-4-menjizhenyewulangzhanbi title="门急症业务量占比" :items="items3"></box-card-multi-analysis-4-menjizhenyewulangzhanbi>
              </el-col>
              <el-col :span="8" class="h-345-947 ">
                <box-card-multi-analysis-4-zhuyuanyewuliangzhanbi title="住院业务量占比" :items="items4"></box-card-multi-analysis-4-zhuyuanyewuliangzhanbi>
              </el-col>
            </div>
            <div class=" h-602-947">
              <box-card-single-analysis-4-yiyuanshouru :data="hospitalrevenuestatistics" title="医院收入统计"></box-card-single-analysis-4-yiyuanshouru>
            </div>
          </el-col>
        </el-row>
      </div>
  </div>
</template>

<script>
import analysisHome from './analysisHome'
import BoxCardMultiAnalysis4Menjizhenyewulangzhanbi from './components/box-card-multi-analysis4-menjizhenyewulangzhanbi.vue';
import BoxCardMultiAnalysis4Menzhenshouru from './components/box-card-multi-analysis4-menzhenshouru.vue';
import BoxCardMultiAnalysis4Yijiyewuliang from './components/box-card-multi-analysis4-yijiyewuliang.vue';
import BoxCardMultiAnalysis4Zhuyuanshouru from './components/box-card-multi-analysis4-zhuyuanshouru.vue';
import BoxCardMultiAnalysis4Zhuyuanyewuliangzhanbi from './components/box-card-multi-analysis4-zhuyuanyewuliangzhanbi.vue';
import BoxCardSingleAnalysis4Yiyuanshouru from './components/box-card-single-analysis4-yiyuanshouru.vue';

export default {
components: {
    analysisHome,
    BoxCardMultiAnalysis4Menzhenshouru,
BoxCardMultiAnalysis4Zhuyuanshouru,
BoxCardSingleAnalysis4Yiyuanshouru,
BoxCardMultiAnalysis4Yijiyewuliang,
BoxCardMultiAnalysis4Menjizhenyewulangzhanbi,
BoxCardMultiAnalysis4Zhuyuanyewuliangzhanbi
  },
  data() {
    return {
      curId1:0,
      items1:[
        {id:0,label:'医疗'},
        {id:1,label:'药品'},
        {id:2,label:'医保医疗'},
        {id:3,label:'医保药品'}
      ],
      curId2:0,
      items2:[
        {id:0,label:'门急症'},
        {id:1,label:'住院'}
      ],
      curId3:0,
      items3:[
        {id:0,label:'今年'},
        {id:1,label:'去年'}
      ],
      curId4:0,
      items4:[
        {id:0,label:'今年'},
        {id:1,label:'去年'}
      ],
      curId5:0,
      items5:[
        {id:0,label:'医疗'},
        {id:1,label:'药品'},
        {id:2,label:'医保医疗'},
        {id:3,label:'医保药品'}
      ],
      hospitalrevenuestatistics:[
        {
          id:1,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:2,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:3,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:4,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:5,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:6,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:7,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:8,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:9,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:10,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:11,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        },
        {
          id:12,
          hname:'陇西县第一人民医院',
          eincome:'1222万元',
          mincome:'1222万元',
          rincome:'1222万元',
          zincome:'1222万元',
          aincome:'1222万元',
          bincome:'1222万元',
          cincome:'1222万元',
          dincome:'1222万元'
        }
      ]
    };
  },
  methods: {
    tableRowClassName({ row, rowIndex }) {
        if ((rowIndex + 1) % 2 === 0) {
            return "warning-row"; //类名
        } else {
            return "success-row"; //类名
        }
    },
  },
};
</script>

<style scoped lang="less">
.left{float: left;}
.right{float: right;}
.red{ background: red;}
.green{ background: green;}
.blue{ background: blue;}
.yellow{ background: yellow; }
.data-container{
  background:url('~@/assets/images/large-bg.png') no-repeat;
  height: 100vh;
  background-size:cover;
  background-position: center center;
  .analysis4-main-content{
    padding:.1rem;
    .el-row{
      height: calc(100vh - 1.23rem);
      .el-col{
        height:calc(100vh - 1.23rem);
        .borderBottom-1px{
          border-bottom: .01rem solid #7787C7 ;
        }
        .borderBottom-2px{
          border-bottom: .02rem solid #7787C7 ;
        }
        .box-card{
          width: 100%;
          height:calc( (100vh - 1.23rem) / 3 );
          .head-wrap{
            font-size: .16rem;
            color:#ffffff;
            overflow: hidden;
            .title{
              height: .26rem;
              line-height: .262rem;
            }
            .operate{
              span{
                height: .26rem;
                line-height: .26rem;
                display: inline-block;
                cursor: pointer;
                background: url('~@/assets/images/671.png') no-repeat center center;
                background-size: contain;
                padding: 1px .2rem;
                width: .64rem;
                text-align: center;
                font-size: .10rem;
              }
              span.active{
                background: url('~@/assets/images/670.png') no-repeat center center;
                background-size: contain;
                padding: 1px .2rem;
              }
            }
          }
          .content-wrap{
            width: 100%;
            height:calc( (100vh - 1.23rem) / 3 - .36rem) ;
            .chart-content{
              width: 100%;
              height:calc( (100vh - 1.23rem) / 3 - .36rem) ;
              float: left;
              overflow: hidden;
            }
          }
          img{width: 100%;float: left;}
        }
        .h-1-3{height:calc( (100vh - 1.23rem) / 3 ) !important;}
        .h-1-2{height:calc( (100vh - 1.20rem) / 2 ) !important;overflow: hidden;padding: 0 .1rem}
        .h-345-947{height:calc( (100vh - 1.23rem) * 345 / 947 ) !important;}
        .h-602-947{height:calc( (100vh - 1.23rem) * 602 / 947 ) !important;}
      }
    }
  }
}
</style>

